<template>
	<view class="goldDetails">
		<n-loading></n-loading>
		<view v-if="ready">
			<view class="cardNo" v-if="spikeList.length==0">
				<image src="../../static/svgIcon/noIntegral.svg" mode=""></image>
				<view class="tips">暂无明细~</view>
			</view>
			<view class="item" v-for="(item,index) of spikeList" :key="index">
				<view class="box">
					<view class="tit">{{item.name}}</view>
					<view class="time">{{getdate(item.updated_at,1)}}</view>
				</view>
				<view class="num" :class="{num1:item.type==1}">{{item.type==0?'+':'-'}}{{item.num}}</view>
				<image class="gold" src="https://lovebirdopen.com/static/img/svgIcon/sEarIcon.svg" mode=""></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data() {
			return{
				// 订单列表
				spikeList:[],
				ready:null,
				isLoadMore:false,
				page: 1,
				pageSize: 10,
			}
		},
		onLoad: function (option) {
			this.getSpikeList();
		},
		// 滑动到底部
		onReachBottom() {
			if(!this.isLoadMore){
				this.getSpikeList()
			}
		},
		methods:{
			getSpikeList() {
				this.apiget('/mall/storage-liquor/record', {page:this.page,pageSize:this.pageSize}).then(res => {
					if (res.data.status == 200) {
						this.spikeList = this.spikeList.concat(res.data.data.list);
						this.ready = 1;
						if(res.data.data.list.length<this.pageSize){
							this.isLoadMore = true;
							this.status = 'nomore';
						}else if(res.data.data.list.length==this.pageSize && this.page == res.data.data.pageCount){
							this.isLoadMore = true;
							this.status = 'nomore';
						}else{
							this.status = 'loading';
							this.page = ++ this.page;
						}
					}
				})
			},
			
		}
	}
</script>

<style lang="scss">
	.goldDetails{
		min-height: 100%;
		padding: 24rpx 0;
		background: #F8F8FA;
		
		.item{
			display: flex;
			align-items: center;
			padding: 24rpx 32rpx;
			background-color: #fff;
			
			.box{
				flex: 1;
				width: 1px;
				
				.tit{
					font-size: 28rpx;
					line-height: 40rpx;
					color: #333333;
				}
				.time{
					font-size: 24rpx;
					line-height: 40rpx;
					color: #999999;
				}
			}
			.num{
				font-size: 32rpx;
				color: #FF5238;
				font-weight: bold;
			}
			.num1{
				color: #333;
			}
			.gold{
				width: 16rpx;
				height: 40rpx;
				margin-left: 8rpx;
			}
		}
	}
	.cardNo{
		padding-top: 100rpx;
		text-align: center;
		
		image{
			display: inline-block;
			width: 336rpx;
			height: 336rpx;
		}
		
		.tips{
			font-size: 28rpx;
			line-height: 44rpx;
		}
	}
</style>
